<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>chat</title>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script>
        // function checkData(){
        //
        //
        //     var file = $("#attr").files[0];
        //     console.log(file);
        //     console.log(file.length);
        // }

        $(function(){
            $("#btn").click(function(){
                var f=document.getElementById("attr").files[0];
               // console.log(f);
               // console.log(f==undefined);
                   if(f==undefined){
                        console.log('您至少选择一个文件在上传吧!');
                        $("#file1").html('您至少选择一个文件在上传吧!');
                        $("#file1").css('color','red');
                   }else{
                       //选中了二进制文件的
                       if(f.type!='image/jpeg'){
                            console.log('您好，你选中的文件必须是图像格式的!');
                           $("#file1").html('你选中的文件必须是图像格式的!');
                           $("#file1").css('color','red');
                       }else{
                           //280KB  287277
                           //140KB  143638
                           if(f.size>300000){
                                console.log('请上传文件的大小不能高于140KB');
                               $("#file1").html('请上传文件的大小不能高于140KB');
                               $("#file1").css('color','red');
                           }else{
                               document.getElementById("form1").submit();
                           }
                       }
                   }



            });
        });
    </script>
</head>
<body>
<form action="upload" method="post" enctype="multipart/form-data" id="form1">
<p>视频:<input type="file" name="attr" id="attr">
    <span id="file1">请上传视频</span></p>
<p><input type="button" value="上传" id="btn"></p>
</form>
</body>
</html>